<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet" />
    <link href="https://cdn.bootcdn.net/ajax/libs/minireset.css/0.0.2/minireset.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="dist/1.css" />
    <link rel="stylesheet" href="../bootstrap/bootstrap.css" />
    <title>后盾人顶部导航</title>
  </head>
  <body>
    <div class="container">
      <div class="navbar">
        <div class="logo">
          <i class="fa fa-code" aria-hidden="true"></i>
          houdunren.com
        </div>
        <nav>
          <a href="">系统学习</a>
          <a href="">实战课程</a>
          <a href="">最近更新</a>
          <a href="">话题讨论</a>
          <a href="">签到打卡</a>
          <a href="">订阅会员</a>
          <a href="">在线文档</a>
          <a href="">训练营</a>
          <a href="">直播间</a>
        </nav>
        <div class="member">
          <div class="message">
            <i class="fa fa-envelope-o" aria-hidden="true"></i>
            <span>118</span>
          </div>
          <div class="user">
            <img src="../images/user.jpeg" alt="" srcset="" />
            <div class="icon">
              <label for="toggle-menu">
                <span>用户名达</span>
                <i class="fa fa-sort-desc" aria-hidden="true"></i>
              </label>
            </div>
            <input type="checkbox" id="toggle-menu" hidden />
            <nav>
              <a href="">修改资料</a>
              <a href="">头像设置</a>
              <a href="">密码修改</a>
              <a href="">手机绑定</a>
              <a href="">邮箱绑定</a>
              <hr />
              <a href="">站内消息</a>
              <a href="">学习历史</a>
              <a href="">我的帖子</a>
              <a href="">会员周期</a>
              <a href="">订单列表</a>
              <hr />
              <a href="">个人主页</a>
              <hr />
              <a href="">退出</a>
            </nav>
          </div>
        </div>
        <div class="toggle-icon">
          <i class="fa fa-bars" aria-hidden="true"></i>
        </div>
      </div>
    </div>
  </body>
</html>
